AULA04 - Estruturas de Decisão¶

AGENDA¶

Estrutura de Decisão Simples
Estrutura de Decisão Composta
Estrutura de Decisão Encadeada
Switch Case
Operador Ternário
Referências
Perguntas

1. Estruturas de Decisão¶

De acordo com [MDN Web Docs], "em qualquer linguagem de programação, o código precisa tomar decisões e realizar ações de acordo, dependendo de diferentes entradas".
Para aprofundamento consulte MDN Web Docs.

1.1. Estruturas de Decisão Simples¶

Sintaxe:
- A palavra reservada if seguida de um par de parênteses ( ), onde a condição deverá ser indicada, e as linhas de código serão inseridas entre as chaves { }.

if (condição) {
    ... linhas de código finalizadas com ponto e vírgula;
}

1.2. Estruturas de Decisão Composta¶

Sintaxe:
- A palavra reservada if seguida de um par de parênteses ( ), onde a condição deverá ser indicada, e as linhas de código serão inseridas entre as chaves { }.
- E a palavra reservada else seguida de chaves { }, onde serão informadas as demais linhas de código, caso seja falso o teste da condição.

if (condição) {
    ... linhas de código finalizadas com ponto e vírgula;
} else {
     ... linhas de código finalizadas com ponto e vírgula;
}

1.3. Estruturas de Decisão Encadeada¶

Sintaxe:

if (condição1) {
    ... serão executadas as linhas de código caso condição1 seja verdadeira;
} else if (condição2) {
     ... serão executadas as linhas de código caso condição1 falsa e a condição2 seja verdadeira;
} else if (condição3) {
     ... serão executadas as linhas de código caso condição1, condição2 falsas e a condição3 seja verdadeira;
} else if (condição4) {
     ... serão executadas as linhas de código caso condição1, condição2, condição3 falsas e a condição4 seja verdadeira;
} else {
     ... serão executadas as linhas de código caso todas as condições anteriores foram falsas;
}

Exemplo:

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <title>Estruturas de Decisão</title>
</head>
<body>
    <script>
      let d = new Date();
      let h = d.getHours();
      if (h >= 0 && h <= 12) {
        console.log("Bom dia!!!");
      } else if (h <= 18) {
        console.log("Bom tarde!!!");
      } else if (h > 18) {
        console.log("Boa noite!!");
      }
    </script>
</body>
</html>

2. Switch Case¶

De acordo com MDN Web Docs, "As instruções if ... else possuem suas desvantagens. Elas são boas principalmente para casos em que você tem algumas opções, e cada uma requer uma quantidade razoável de código para ser executado, e / ou as condições são complexas (por exemplo, vários operadores lógicos)".
Ainda segundo [MDN Web Docs], "nos casos em que você deseja definir uma variável para uma determinada opção de valor ou imprimir uma determinada instrução dependendo de uma condição, a sintaxe pode ser um pouco incômoda, especialmente se você tiver um grande número de opções".
Sintaxe:

switch (expressão) {  
    case rotulo1: 
        .... declarações;
        break;  
    case rotulo2: 
        .... declarações;
        break;
    case rotulo3: 
        .... declarações;
        break;

    default: 
        .... declarações;
        break;
}

A palavra reserva switch utiliza uma única expressão / valor como uma entrada e, em seguida, examinam várias opções até encontrarem um que corresponda a esse valor, executando o código correspondente que o acompanha.
A palavra reservada switch seguida de um par de parênteses ( ), onde a expressão deverá ser indicada, e as chaves { }, que conterão cada uma das escolhas, por meio do uso da palavra reservada case seguida da escolha rótulo :, onde serão informadas as demais linhas de código, caso seja verdadeiro a escolha da expressão.
O break; serve para interromper o bloco e seguirá normalmente nas linhas de código fora do switch.

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <title>Estruturas de Decisão</title>
</head>
<body>
    <script>
       tipoFruta = prompt("Indique um tipo de fruta: ");
       switch (tipoFruta) {
         case "laranja":
           console.log("O preço da " + tipoFruta + " é R$ 5.00.");
           break;
         case "P\pera":
           console.log("O preço da " + tipoFruta + " é R$ 5.00.");
           break;
         case "abacaxi":
           console.log("O preço da " + tipoFruta + " é R$ 5.00.");
           break;
         case "abacate":
           console.log("O preço da " + tipoFruta + " é R$ 5.00.");
           break;
          default:
            console.log("Não temos esta fruta!!");
            break;
       }
       console.log("Gostaria de mais alguma coisa?");
    </script>
</body>
</html>

3. Operador Ternário¶

O operador ternário testa uma condição e retorna um valor / expressão se for verdadeira e outro caso seja falso. Muito útil no caso de pouco código a escrever.

Sintaxe:

(condição) ? resposta ao teste verdadeiro :  resposta ao teste falso;

Exemplo:

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <title>Estruturas de Decisão</title>
</head>
<body>
    <script>
            let tipoFruta = prompt("Indique o tipo de fruta: ");
            let resultado = tipoFruta == "Abacaxi" ? "Acertou o tipo de fruta!" : "Errou o tipo, tente novamente!";
            console.log(resultado + "!!");
    </script>
</body>
</html>

Referências¶

Esta aula foi elaborada a partir do conteúdo disponibilizado em cada um dos links indicados no próprio texto.

ADS - HTML5, CSS3, JS.
Modelo e formato elaborado pela profa. Ana Paula Müller Giancoli - BSD 2-Clause License. - Julho.2022.

</div> </div>